// placeholder 字体颜色
@mixin placeholder-color($color){
	&::-webkit-input-placeholder { /* WebKit browsers */
		color: $color;
	};
	&:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
		color: $color;
	};
	&::-moz-placeholder { /* Mozilla Firefox 19+ */
		color: $color;
	};
	&:-ms-input-placeholder { /* Internet Explorer 10+ */
		color: $color;
	};
}
// 浏览器高清适配 字体
@mixin property-dpr($property,$px-values){
    //判断参数是不是单个数字，若是
    @if type-of($px-values) == "number"{
            #{$property}: $px-values / 2;
        [data-dpr="2"] & {
            #{$property}: $px-values;
        }
        // for mx3
        [data-dpr="2.5"] & {
            #{$property}: $px-values * 2.5 / 2;
        }
        [data-dpr="2.625"] & {
            #{$property}: $px-values * 2.625 / 2;
        }
        // for 小米note
        [data-dpr="2.75"] & {
        	#{$property}: $px-values * 2.75 / 2;
    	}
        [data-dpr="3"] & {
            #{$property}: $px-values / 2 * 3;
        }
        [data-dpr="3.5"] & {
            #{$property}: $px-values / 2 * 3.5;
        }
        // for 三星note4
	    [data-dpr="4"] & {
	        #{$property}: $px-values * 2;
	    }
    }
    //若为数组则
    @else {
        //新建两个空数组
        $onedpr-values:();
        $twodpr-values:();
        $twofivedpr-values:();
        $twosixdpr-values:();
        $twosixtwofivedpr-values:();
        $threedpr-values:();
        $threefivedpr-values:();
        $fourdpr-values:();
        //遍历多值变量
        @each $value in $px-values{
        	$onedpr-values:append($onedpr-values,$value/2);
            $twodpr-values:append($twodpr-values,$value);
            $twofivedpr-values:append($twofivedpr-values,$value/2*2.5);
            $twosixdpr-values:append($twosixdpr-values,$value/2*2.75);
            $twosixtwofivedpr-values:append($twosixtwofivedpr-values,$value/2*2.625);
            $threedpr-values:append($threedpr-values,$value/2*3);
            $threefivedpr-values:append($threefivedpr-values,$value/2*3.5);
            $fourdpr-values:append($fourdpr-values,$value*2);
        }
        // 返回处理后的多值变量
       #{$property}: $px-values / 2;
        [data-dpr="2"] & {
            #{$property}: $twodpr-values;
        }
        [data-dpr="2.5"] & {
            #{$property}: $twofivedpr-values;
        }
        [data-dpr="2.625"] & {
            #{$property}: $twosixtwofivedpr-values;
        }
        [data-dpr="2.75"] & {
            #{$property}: $twosixdpr-values;
        }
        [data-dpr="3"] & {
            #{$property}: $threedpr-values;
        }
        [data-dpr="3.5"] & {
            #{$property}: $threefivedpr-values;
        }
        [data-dpr="4"] & {
            #{$property}: $fourdpr-values;
        }
    }
}
// 文本缩略
@mixin ellipsis($num) {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $num;
    overflow: hidden;
}
// 背景图
@mixin bg-image($url){
	background-image: url($url + "@2x.png");
	background-size: contain;
	background-repeat: no-repeat;
  @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3){
	background-image: url($url + "@3x.png");
	background-size: contain;
	background-repeat: no-repeat;
  }
}
// 安卓 1px线
@mixin bt-1px($color){
	position: relative;
  &:before{
	display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border-top: 1px solid $color;
    content: ' ';
  }
}
@mixin br-1px($color){
    position: relative;
  &:after{
    display: block;
    position: absolute;
    left: 50%;
    top: 0;
    height: 100%;
    border-right: 1px solid $color;
    content: ' ';
  }
}
  
@mixin bb-1px($color){
	position: relative;
  &:after{
  	display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-bottom: 1px solid $color;
    content: ' ';
  }
}
@mixin bt-2px($color){
	position: relative;
  &:before{
	display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    border-top: 2px solid $color;
    content: ' ';
  }
}
  
@mixin bb-2px($color){
	position: relative;
  &:after{
  	display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    border-bottom: 4px solid $color;
    content: ' ';
  }
}